<!DOCTYPE html>
<html lang="zh">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta id="wxKeywords" name="Keywords" content="星语心愿" />
<meta id="wxDescription" name="Description" content="星语心愿" />
<title>确认支付_星语心愿</title>
<!--全局resetCss样式开始-->
<link href="../assets/css/reset.css" rel="stylesheet" type="text/css" />
<!--全局resetCss样式结束-->

<!--订单公用commonCss样式开始-->
<link href="../assets/css/order/common.css" rel="stylesheet" type="text/css" />
<!--订单公用commonCss样式结束-->

<!--页面Css样式开始-->
<link href="../assets/css/order/payment.css" rel="stylesheet" type="text/css" />
<!--页面Css样式结束-->

<!--主题themeCss样式开始-->
<link href="../assets/css/theme.css" rel="stylesheet" type="text/css" />
<!--主题themeCss样式结束-->
</head>
<body>
<!--头部开始-->
<div class="header clearfix">
	
    <!--头部工具栏开始-->
    <div class="header_tool">
		<!--头部工具栏主体开始-->
		<div class="tool_main clearfix">

			<!--左侧工具栏开始-->
			<div class="tool_left clearfix">
				<a>您好，欢迎来到星语心愿，请</a>
				<a href="#" class="green login">登录</a>
				<a href="#" class="orange reg">免费注册</a>

				<!--<a href="#" class="green nickname" title="好命先生好命先生">好命先生</a>
				<a>您好，欢迎来到星语心愿</a>
				<a href="#" class="red loginout">[退出登陆]</a>-->
			</div>
			<!--左侧工具栏结束-->

			<!--右侧工具栏开始-->
			<div class="tool_right clearfix" id="tool_right">
				<ul class="clearfix">
					<li class="clearfix">
						<a class="member_info" href="">
							<span class="tool_img tool_headpic"><img src="../assets/images/content/member_01.jpg" alt="" /></span>
							<span class="tool_nickname" title="凌大厨">凌大厨</span>
							<span class="tool_icon"><i class="icon_common icon_down"></i></span>
						</a>
						<!--展开顶级菜单开始-->
						<ul>
							<li>
								<a href="" title="">我的主页</a>
							</li>
							<li>
								<a href="" title="">账号设置</a>
							</li>
							<li>
								<a href="" title="">退出</a>
							</li>
						</ul>
						<!--展开顶级菜单结束-->
					</li>
					<li class="msg_nums clearfix">
						<a href="" title="">
							<span>消息</span>
							<i class="icon_common icon_nums">12</i>
						</a>
					</li>
					<li class="clearfix">
						<a href="" title="">
							<span>我的订单</span>
							<span class="tool_icon"><i class="icon_common icon_down"></i></span>
						</a>
					</li>
					<li class="clearfix">
						<a href="" title="">
							<span>收藏夹</span>
							<span class="tool_icon"><i class="icon_common icon_down"></i></span>
						</a>
					</li>
					<li class="clearfix">
						<a href="" title="">
							<span>服务分类</span>
							<span class="tool_icon"><i class="icon_common icon_down"></i></span>
						</a>
					</li>
					<li class="clearfix">
						<a href="" title="">
							<span>联系客服</span>
							<span class="tool_icon"><i class="icon_common icon_down"></i></span>
						</a>
					</li>
					<li class="clearfix">
						<a href="" title="">
							<span class="tool_icon"><i class="icon_common icon_app"></i></span>
							<span class="orange">APP下载</span>
						</a>
					</li>
				</ul>
			</div>
			<!--右侧工具栏结束-->
		</div>
		<!--头部工具栏主体结束-->
    </div>
    <!--头部工具栏结束-->
    
    <div class="space_hx">&nbsp;</div>
    
    <!--头部中间内容开始-->
    <div class="header_content clearfix">
    	
        <!--头部logo开始-->
        <div class="header_logo">
        	<a href="#" title>
            	<img src="../assets/images/logo.jpg" alt="" />
            </a>
        </div>
        <!--头部logo结束-->
        
        <!--页面提示开始-->
        <div class="header_tip">确认支付</div>
        <!--页面提示结束-->
        
        <!--订单流程开始-->
        <div class="header_process clearfix">
        	<!--注意：hover为当前步骤，passed为已完成步骤-->
        	<!--购物车入口开始-->
        	<ul class="shopcar_process clearfix">
        		<li class="passed">
        			<span class="num">1</span>
        			<span class="title">我的购物车</span>
        		</li>
        		<li class="passed">
        			<span class="num">2</span>
        			<span class="title">填写核对订单信息</span>
        		</li>
        		<li class="hover">
        			<span class="num">3</span>
        			<span class="title">确认支付</span>
        		</li>
        		<li>
        			<span class="num">4</span>
        			<span class="title">支付结果</span>
        		</li>
        	</ul>
        	<!--购物车入口结束-->
        	<!--立即购买入口开始-->
        	<!--<ul class="buy_process clearfix">
        		<li class="passed">
        			<span class="num">1</span>
        			<span class="title">填写核对订单信息</span>
        		</li>
        		<li class="hover">
        			<span class="num">2</span>
        			<span class="title">确认支付</span>
        		</li>
        		<li>
        			<span class="num">3</span>
        			<span class="title">支付结果</span>
        		</li>
        	</ul>-->
        	<!--立即购买入口结束-->
        </div>
        <!--订单流程结束-->
    </div>
    <!--头部中间内容结束-->
    
</div>
<!--头部结束-->

<!--身体开始-->
<div class="layer clearfix" id="layer">
	
	<!--确认支付表单开始-->
	<form class="payment_form" name="payment_form" id="payment_form" method="">
		
		<!--订单信息开始-->
		<div class="payment_common payment_order">
			<ul>
				<li class="order_tips">
					<i class="icon_order icon_order_msg"></i>
					<span>订单提交成功，请您尽快付款！ </span>
				</li>
				<li class="order_time">
					请您在提交订单后<em>45分钟</em>内完成支付，否则订单会自动取消。
				</li>
				<li class="order_msg">
					<span>订单号：10215920871</span>
					<span id="order_money" price='1000'>应付总额： <em class="price orange">￥1000</em></span>
					<span>
						<a href="" title="">订单详情 <i class="icon_order icon_down"></i></a>
					</span>
				</li>
				<li class="order_address">
					<span>约见人姓名：苏菂</span>
					<span>收货地址：湖南 长沙市 岳麓区 麓谷街道麓谷信息港21楼 </span>
					<span>联系方式：139****3489</span>
				</li>
				<li class="order_service">服务名称：和车库咖啡老板苏菂，面对面聊创业！</li>
			</ul>
		</div>
		<!--订单信息结束-->
		
		<!--支付方式开始-->
		<div class="payment_common payment_way" id="payment_way">
			<h2>支付方式</h2>
			<ul class="clearfix">
				<li class="way_wechat"><!--高亮样式hover-->
					<i class="icon_order icon_wechat"></i>
					<i class="icon_order icon_hover"></i>
					<span class="name">微信支付</span>
				</li>
				<li class="way_alipay">
					<i class="icon_order icon_alipay"></i>
					<i class="icon_order icon_hover"></i>
					<span class="name">支付宝</span>
				</li>
				<!--注意：余额不足时隐藏钱包支付-->
				<li class="way_wallet">
					<i class="icon_order icon_wallet"></i>
					<i class="icon_order icon_hover"></i>
					<span class="name">钱包支付</span>
					<span class="wallet">( 余额：￥<em class="orange" id="wallet_money">12000.00</em> )</span>
				</li>
			</ul>
		</div>
		<!--支付方式结束-->
		
		<!--微信扫码支付开始-->
		<div class="payment_wechat clearfix" id="payment_wechat">
			<div class="wechat_code">
				<ul>
					<li class="code_img">
						<!--支付二维码开始-->
						<img src="../assets/images/code.jpg"  alt="" />
						<!--支付二维码结束-->
					</li>
					<li class="code_tip cmain_bg_color clearfix">
						<span>
							<i  class="icon_order icon_sweep"></i>
							<em class="tip">
								请使用微信扫一扫<br/>扫描二维码支付
							</em>
						</span>
					</li>
				</ul>
			</div>
			<div class="wechat_sweep">
				<img src="../assets/images/wechat.jpg" alt=""  />
			</div>
		</div>
		<!--微信扫码支付结束-->
		
		<!--确认支付工具开始-->
		<div class="payment_tool clearfix">
			<span class="btn payment_order" id="payment_order">立即支付</span>
		</div>
		<!--确认支付工具结束-->
		
	</form>
	<!--确认支付表单结束-->
	
</div>
<!--身体结束-->

<!--底部开始-->
<div class="footer clearfix">
	
	<!--提供的服务、保障开始-->
    <div class="service footer_service">
    	<ul class="clearfix">
        	<li>
        		<i class="icon_common icon_five5"></i>
                <span>五大服务保障</span>
            </li>
            <li>
        		<i class="icon_common icon_smrz"></i>
                <span>实名认证</span>
            </li>
            <li>
        		<i class="icon_common icon_zzrz"></i>
                <span>资质认证</span>
            </li>
            <li>
        		<i class="icon_common icon_zfaq"></i>
                <span>支付安全</span>
            </li>
            <li>
        		<i class="icon_common icon_zyfw"></i>
                <span>专业服务</span>
            </li>
            <li>
        		<i class="icon_common icon_shwy"></i>
                <span>售后无忧</span>
            </li>
        </ul>
    </div>
	<!--提供的服务、保障结束-->
		
	<!--底部主体开始-->
    <div class="footer_main clearfix">
        
        <!--底部快捷导航开始-->
        <div class="footer_link clearfix">
        	<dl>
            	<dt>
                	新手指南
                </dt>
                <dd>
                	<a href="">注册登录</a>
                </dd>
                <dd>
                	<a href="">完善资料</a>
                </dd>
                <dd>
                	<a href="">购买流程</a>
                </dd>
                <dd>
                	<a href="">会员介绍</a>
                </dd>
                <dd>
                	<a href="">常见问题</a>
                </dd>
            </dl>
            <dl>
            	<dt>
                	支付方式
                </dt>
                <dd>
                	<a href="">在线支付</a>
                </dd>
                <dd>
                	<a href="">星币支付</a>
                </dd>
                <dd>
                	<a href="">转账汇款</a>
                </dd>
            </dl>
            <dl>
            	<dt>
                	安全保障
                </dt>
                <dd>
                	<a href="">实名认证</a>
                </dd>
                <dd>
                	<a href="">资质认证</a>
                </dd>
                <dd>
                	<a href="">支付安全</a>
                </dd>
                <dd>
                	<a href="">专业服务</a>
                </dd>
                <dd>
                	<a href="">售后无忧</a>
                </dd>
            </dl>
            <dl>
            	<dt>
                	售后服务
                </dt>
                <dd>
                	<a href="">发票相关</a>
                </dd>
                <dd>
                	<a href="">退款说明</a>
                </dd>
                <dd>
                	<a href="">忘记密码</a>
                </dd>
                <dd>
                	<a href="">意见反馈</a>
                </dd>
            </dl>
            <dl>
            	<dt>
                	联系我们
                </dt>
                <dd>
                	<a href="">新浪微博</a>
                </dd>
                <dd>
                	<a href="">官方微信</a>
                </dd>
                <dd>
                	<a href="">关于我们</a>
                </dd>
                <dd>
                	<a href="">联系我们</a>
                </dd>
            </dl>
        </div>    
        <!--底部快捷导航结束-->
        
        <!--底部二维码导航开始-->
        <div class="footer_code">
        	<img src="../assets/images/code.jpg" alt="" />
            <p>微信二维码</p>
        </div>  
        <!--底部二维码导航结束-->
        
        <!--底部联系方式开始-->
        <div class="footer_tel">
        	<p class="title">咨询电话</p>
            <p class="number">400-666-6789</p>
            <p>E-mail：400000@qq.com</p>
            <p>QQ：4000 000</p>
        </div>
        <!--底部联系方式结束-->
        
    </div>
	<!--底部主体结束-->
    
    <div class="space_hx">&nbsp;</div>
    
    <!--底部版权信息开始-->
    <div class="footer_copyright">
    	© 2015 长沙星语心愿信息技术有限公司 版权所有   湘ICP备10000087号
    </div>
    <!--底部版权信息结束-->

</div>
<!--底部结束-->

<!--身体右边公用侧边栏开始-->
<div class="body_fixed_nav" id="body_fixed_nav">
	<a href="" title="" class="clearfix">
		<span class="icon"><i class="icon_common icon_msg"></i></span>
		<span class="word">在线留言</span>
	</a>
	<a href="" title="" class="clearfix">
		<span class="icon"><i class="icon_common icon_love"></i></span>
		<span class="word">我的最爱</span>
	</a>
	<a href="" title="" class="clearfix">
		<span class="icon"><i class="icon_common icon_history"></i></span>
		<span class="word">浏览历史</span>
	</a>
	<a href="" title="" class="clearfix">
		<span class="icon"><i class="icon_common icon_collect"></i></span>
		<span class="word">我的收藏</span>				
	</a>
	<a href="javascript:;" title="" id="nav_back_top" class="clearfix">
		<span class="icon"><i class="icon_common icon_backtop"></i></span>
		<span class="word">回到顶部</span>
	</a>
</div>
<!--身体右边公用侧边栏结束-->

<!--Jquery库开始-->
<script type="text/javascript" src="../assets/js/lib/jquery-1.8.3.min.js"></script>
<!--Jquery库结束-->
<!--公用cmmonJS开始-->
<script type="text/javascript" src="../assets/js/common/common.js"></script>
<!--公用cmmonJS结束-->
<!--弹出层插件layer开始-->
<script type="text/javascript" src="../assets/plugins/layer/layer.js"></script>
<!--弹出层插件layer结束-->
<script type="text/javascript">
$(function(){
	//选择支付方式
	$('#payment_way>ul>li').on('click',function(){
		$(this).addClass('hover').siblings().removeClass('hover');
	});
	
	//微信支付--扫描支付
	$('#payment_way>ul>li.way_wechat').on('click',function(){
		var obj = $(this);
		layer.open({
            type: 1,
            title: '微信扫码支付',
            shadeClose: true,
            shade: 0.5,
            closeBtn: 1,
            maxmin: false, //开启最大化最小化按钮
            area: ['650px', '460px'],
            content: $('#payment_wechat'),
            end:function(index){//取消和关闭按钮触发的回调
            	obj.removeClass('hover');
            }
        });
	});
	
	//提交表单--确认支付
	$('#payment_order').on('click',function(){
		$('#payment_form').submit();
	});
});
</script>
</body>
</html>
